<template>
	<view>
		<div class="top">
			<div class="xxxg">


				<!-- 卡片开始 -->
				<uni-card class="xxxg-card"   padding="10px 0" :thumbnail="avatar" >
				
				<div style="width: 100%; ">
				
				<div style="display: flex;justify-content: center;margin-top: 20rpx;">
					<image src="/static/wdimg/qxcc.png" style="width: 400rpx;" mode="widthFix"></image>
				</div>
				<div style="display: flex;justify-content: center; margin-top: 30rpx;">
					
					
				</div>
					
			<uni-forms ref="baseForm" :modelValue="baseFormData">
				
				<div class="form-mokuai">
				<div class="form-mokuai-lift">车辆类型</div>
					<div class="form-mokuai-right">
			
				      <uni-data-select class="form-mokuai-right-boder"
				        v-model="baseFormData.careleix"
				        :localdata="range"
						
				        @change="change"
				      ></uni-data-select>
			
					</div>
				</div>
				
				<div class="form-mokuai">
				<div class="form-mokuai-lift">车辆型号</div>
					<div class="form-mokuai-right">
		
				      <uni-data-select
					  class="form-mokuai-right-boder"
				        v-model="baseFormData.careleix"
				        :localdata="range"
						
				        @change="change"
				      ></uni-data-select>
				
					</div>
				</div>
				
				
				<div class="form-mokuai">
				<div class="form-mokuai-lift">车牌号码</div>
					<div class="form-mokuai-right">
			<uni-forms-item class="form-mokuai-right-boder" >
			<uni-easyinput v-model="baseFormData.name" placeholder="请输入车牌号码" />
			</uni-forms-item>
					</div>
				</div>
				
		<div class="form-mokuai">
			<div class="form-mokuai-lift">车主姓名</div>
				<div class="form-mokuai-right">
		<uni-forms-item class="form-mokuai-right-boder" >
		<uni-easyinput v-model="baseFormData.name" placeholder="请输入车主姓名" />
		</uni-forms-item>
				</div>
			</div>
				
			<div class="form-mokuai">
				<div class="form-mokuai-lift">电话号码</div>
					<div class="form-mokuai-right">
			<uni-forms-item class="form-mokuai-right-boder" >
			<uni-easyinput v-model="baseFormData.name" placeholder="请输入电话号码" />
			</uni-forms-item>
					</div>
				</div>	
				
				
				<div class="form-mokuai" style="margin-bottom: 200rpx;">
					<div class="form-mokuai-lift">照片</div>
						<div class="form-mokuai-right">
				<uni-forms-item class="form-mokuai-right-boder" >
		<u-upload
			:fileList="fileList1"
			@afterRead="afterRead"
			@delete="deletePic"
			name="1"
			multiple
			:maxCount="10"
		></u-upload>
				</uni-forms-item>
						</div>
					</div>	
				
			</uni-forms>		
				</div>
				
				</uni-card>
				<!-- 卡片结束 -->

				


			
			
			</div>
		</div>

		<div class="under-tianjia" @click="tztjcl">
			<button class="under-button">
				+ 添加车辆
			</button>
		</div>

	</view>
</template>

<script>
	export default {
		data() {
			return {
			
				src: '/static/wdimg/aaa.jpg',
				baseFormData: {
								phone: '',
								yzm: '',
								careleix:''
							
							},
							range: [
							         { value: 0, text: "篮球" },
							         { value: 1, text: "足球" },
							         { value: 2, text: "游泳" },
							       ],
			}
		},
		methods: {
		tztjcl() {
						uni.navigateTo({
							url: "/pages/my/wdcl/tjcg/tjcg"
						})
					},
	

		}
	}
</script>

<style>


	.top {
		width: 750rpx;
		height: 400rpx;
		background-color: #3183FC;
		/* 	overflow: hidden; */
		/* 	background-image: url(@/static/wdimg/aaa.jpg); */
		position: relative;
	}

	.xxxg {
		position: absolute;
		width: 750rpx;

	}

	.xxxg-card {
		/* 		height: 500rpx; */
		/* 	width: 750rpx; */
		border-radius: 25rpx;
	}

	
	.under-tianjia{
		background-color: white;
		width: 100%;
		Position: fixed;
		bottom: 0;
		height: 100rpx;
		
	}
	.under-button{
		background-color: #3183FC;
		color: white;
		width: 80%;
		border-radius: 100rpx;
		height: 70rpx;
		font-size: 30rpx;
		margin-top: 10rpx;
	}
	
	
.form-mokuai{
	display: flex;
	width: 100%;
	margin-top: 50rpx;
	height: 80rpx;
/* 	background-color: yellow; */
}
.form-mokuai-lift{
	background-color: #90CBFB;
	border-radius: 100rpx;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 28%;
	margin-right: 20rpx;
	color: white;
}

.form-mokuai-right{
/* 	background-color: red; */
	width: 70%;
}

.form-mokuai-right-boder{
	border-radius: 100rpx;
}

</style>